<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
   ______                  __  __
  / ____/___  __  ______  / /_/ /_  __
 / /   / __ \/ / / / __ \/ __/ / / / /
/ /___/ /_/ / /_/ / / / / /_/ / /_/ /
\____/\____/\__,_/_/ /_/\__/_/\__, /
              http://count.ly/____/
-->
<html>
<head>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <meta name="referrer" content="no-referrer">
	<link href='stylesheets/pre-login/main.css' rel='stylesheet' type='text/css'>
	<link rel="icon" type="image/png" href="<%- countlyFavicon %>">
    <% if (themeFiles && themeFiles.css) { %>
        <% for(var i=0, l=themeFiles.css.length; i<l; i++) {%>
    <link href='<%= themeFiles.css[i]%>' rel='stylesheet' type='text/css'>
        <% } %>
    <% } %>
	<title><%- countlyTitle %></title>
	<script>window.countlyGlobal = window.countlyGlobal || {}; countlyGlobal["cdn"] = "<%- cdn %>";</script>
    <% if (typeof inject_template.css != 'undefined') { %>
	<style><%- inject_template.css %></style>
	<% } %>
</head>
<body>
	 <% if (message){ %>
		<div id="message"></div>
	 <% } %>
	<div id="top-container">
		<% if (countlyPage){ %>
		<a class="top-button" href="<%- countlyPage %>"><%- countlyTitle %></a>
        <% } %>
		<div class="top-button" id="select-lang">
			<div id="active-lang">EN</div>
			<div id="langs">
				<div class="group">
					<% for(var i=0, l=(languages.length/2); i<l; i++) {%>
    				<a data-language-code="<%=languages[i].code%>" class="item"><%=languages[i].name%></a>
        	<% } %>
				</div>
				<div class="group">
					<% for(var i=(parseInt(languages.length/2) + 1), l=languages.length; i<l; i++) {%>
    				<a data-language-code="<%=languages[i].code%>" class="item"><%=languages[i].name%></a>
        	<% } %>
				</div>
			</div>
		</div>
	</div>
	<div id="login-form">
		<div style="overflow:auto;">
			<!--
			Community Edition license doesn't include the right to remove Countly branding.
			If you wish to implement your own branding (e.g. your own logo, colors, etc.), you must license Countly Enterprise Edition.
			-->
            <div id="login-logo" style="margin-bottom:30px;"></div>
            <form method="POST">
                <div>
                    <input type="text" autocapitalize="off" name="username" placeholder="Username or Email" data-localize="placeholder.username-email"/>
                </div>
                <div>
                    <input name="password" type="password" placeholder="Password" data-localize="placeholder.password"/>
                </div>
                <% if (typeof inject_template.form != "undefined") { %>
                    <%- inject_template.form %>
                <% } %>
                <div>
                    <input type="hidden" value="<%= csrf %>" name="_csrf" />
                    <input type="hidden" value="en" name="lang" id="form-lang" />
                    <input id="login-button" value="Login" type="submit" data-localize="login.button"/>
                </div>
                <div style="margin-top:30px;">
                    <a id="forgot-password" href="./forgot"  data-localize="login.forgot"></a>
                </div>
            </form>
		</div>
        <% if (typeof inject_template.html != "undefined") { %>
            <%- inject_template.html %>
        <% } %>
	</div>
	<script language="javascript" type="text/javascript" src="javascripts/dom/jquery/jquery.js"></script>
	<script language="javascript" type="text/javascript" src="javascripts/utils/prefixfree.min.js"></script>
	<script language="javascript" type="text/javascript" src="javascripts/utils/store+json2.min.js"></script>
	<script language="javascript" type="text/javascript" src="javascripts/utils/jquery.i18n.properties-min-1.0.9.js"></script>
	<script language="javascript" type="text/javascript" src="javascripts/utils/jquery.xss.js"></script>
	<script language="javascript" type="text/javascript" src="javascripts/pre-login.js"></script>
	<script>
        var countlyTitle = "<%- countlyTitle %>";
		$(document).ready(function() {
			<% if (message && message.length > 0){ %>
				showMessage("<%= message %>");
			<% } %>
            if (jQuery.i18n.map["login.title"]) {
                document.title = countlyTitle + " | " + jQuery.i18n.map["login.title"];
            }
		});
		
		$(document).bind('clyLangChange', function() {
            if (jQuery.i18n.map["login.title"]) {
                document.title = countlyTitle + " | " + jQuery.i18n.map["login.title"];
            }
		});
	</script>
	<% if (typeof inject_template.js != 'undefined') { %>
	<script><%- inject_template.js %></script>
	<% } %>
     <% if (themeFiles && themeFiles.js) { %>
        <% for(var i=0, l=themeFiles.js.length; i<l; i++) {%>
    <script language="javascript" type="text/javascript" src="<%=themeFiles.js[i]%>"></script>
        <% } %>
    <% } %>
</body>
</html>